<template>
  <section class="container">
    <div id="test"><div>这里是默认页面</div></div>
    <button @click="textAxios">测试axios</button>
  </section>
</template>

<script>
export default {
  name:"user",
  asyncData(){
    /*它可以在服务端或路由更新之前被调用。在这个方法被调用的时候，第一个参数被设定为当前页面的上下文对象，你可以利用 asyncData方法来获取数据并返回给当前组件。*/
      console.log("组件创建前异步执行区域");
  },
    data(){
      return {
        msg:"这里是user页面",
        userInfo:{
            username:"",
            password:""
        },

      }
    },
    methods:{
        textAxios(){
          var _this = this;
         // console.log(this);
         $.ajax({
            url:"https://api.douban.com/v2/book/search",
            type:"post",
            dataType:"jsonp",
            data:{
              q:"javascript",
              count:1
            },
            success:function(data){
              console.log(data);
            }
         });
          /*this.$axiosMethod.post("https://api.douban.com/v2/book/search",{
            q:"javascript",
            count:1
          },"jsonp")
          .then(data=>{
              console.log(data);
          })
          .catch(error=>{

          })*/
        }
    },
 
}
</script>

<style scoped lang="less">
#test{
  color:red;
  div{
    font-size:18px;
    display:block;
    box-sizing:border-box;
  }
}
</style>
